@import "app";

.video-title {
  margin-top: 50rpx; // 上外边距
  margin-left: 10rpx; // 左外边距
  margin-bottom: 30rpx; // 下外边距
  text-align: center; // 文字居中
  font-weight: bolder; // 文字加粗
  font-size: larger; // 文字大小
}

.video-body {
  margin-bottom: 30rpx; // 下外边距

  video {
    width: 98%; // 宽度
    outline: 10rpx solid $black; // 边框
    box-sizing: border-box; // 盒子模型
  }
}

.video-foot {
  .buttons {
    font-size: 35rpx; // 字体大小

    .col {
      display: inline-block; // 行内块元素
      margin: 0 25rpx; // 外边距
      font-size: 30rpx; // 字体大小
    }

  }

  .info {
    padding-top: 30rpx; // 内边距
    font-size: 30rpx; // 字体大小
    color: $gray; // 颜色

    .col {
      display: inline-block; // 行内块元素
      font-size: 30rpx; // 字体大小
    }

    .left {
      text-align: left; // 文字左对齐
      width: 25%; // 宽度
      padding-left: 20rpx; // 内边距
      box-sizing: border-box; // 盒子模型
    }

    .center {
      width: 55%; // 宽度
    }

    .right {
      padding-right: 20rpx; // 内边距
      box-sizing: border-box; // 盒子模型
      text-align: right; // 文字右对齐
      color: $orange; // 颜色
      width: 20%; // 宽度
    }
  }
}

.operation-tabs {
  margin: 20rpx; // 外边距

  .van-tab {
    color: $subBlack !important; // 文字颜色
    font-weight: bold !important; // 字体粗细
  }

  .catalog {
    padding: 20px 15px; // 内边距
    height: 320px; // 高度
    overflow-y: scroll; // 滚动
    box-sizing: border-box; // 盒子模型

    .van-cell {
      color: $yellow !important; // 颜色
      letter-spacing: 10rpx !important; // 字间距
      background: $black !important; // 背景颜色
      text-align: left !important; // 文字左对齐
    }

    .season-collapse {

      .collapse-item {
        background-color: $bg-gray !important; // 背景颜色
      }

      .van-grid-item__content {
        background-color: $black; // 背景颜色
        color: $white; // 颜色
      }

      .current-episode {
        color: $yellow; // 颜色
        font-weight: bold; // 文字加粗
      }
    }
  }

  .comment {
    .comment-list {
      padding: 20px 15px; // 内边距
      height: 320px; // 高度
      overflow-y: scroll; // 滚动
      box-sizing: border-box; // 盒子模型

      .van-card {
        background: $bg-gray; // 背景颜色
      }

      .van-card__content {
        padding-left: 20rpx; // 内边距
        text-align: left; // 文字左对齐
      }

      .van-card__title {
        font-size: large; // 字体大小
        color: $orange; // 颜色
      }

      .van-card__thumb {
        width: 70rpx; // 宽度
        height: 70rpx; // 高度
      }

      .info {
        margin-top: 20rpx; // 上外边距
        color: $gray; // 颜色
      }

      .content {
        margin-top: 20rpx; // 上外边距
        font-size: large; // 字体大小
        color: $white; // 颜色
      }

      .icon {
        color: $gray; // 颜色
        margin: 20rpx 30rpx 20rpx -8rpx; // 外边距
      }

      .bad-icon {
        transform: rotate(180deg); // 旋转
      }

      .subComments {
        background-color: $subBlack; // 背景颜色
        padding: 20rpx; // 内边距
        margin-top: 10rpx; // 上外边距
        margin-left: 100rpx; // 左外边距
        text-align: left; // 文字左对齐
        color: $white;
      }
    }
  }
}

.sheet {

  padding: 20px 15px; // 内边距

  .van-cell {
    background-color: $bg-gray !important; // 背景颜色
  }

  .van-field__control {
    color: $white !important; // 颜色
    height: 100px !important; // 高度
  }
}